<template>
	<div class="vipcourse">
		<ul>
			<li v-for="(v,i) in this.$store.state.upvipcourse" :key="i">
				<img :src="v.img" />
				<h5>{{v.title}}</h5>
				<span class="piece">￥{{v.pirce}}</span>
				<span class="prepiece">{{v.prepirce}}</span>
				<span class="stu">{{v.stu}}</span>
			</li>
		</ul>
	</div>
</template>

<script>
	export default{
		created() {
			this.$store.dispatch("vipcourseaxios")
		}
	}
</script>

<style lang="scss" scoped="scoped">
	.vipcourse{
		padding-bottom: 0.55rem;
		li{
			list-style: none;
			height: 0.93rem;
			border-bottom: 1px solid #f8f8f8;
			position: relative;
			img{
				width: 1.13rem;
				height: 0.62rem;
				position: absolute;
				top: 0.15rem;
				left: 0.15rem;
			}
			h5{
				font-size: 0.15rem;
				position: absolute;
				top: 0.15rem;
				left: 1.36rem;
			}
			.piece,.prepiece,.stu{
				font-size: 0.12rem;
				position: absolute;
				bottom: 0.15rem;
			}
			.piece{
				color: #df0505;
				left: 1.36rem;
			}
			.prepiece{
				left: 1.8rem;
			}
			.stu{
				right: 0.15rem;
			}
		}
	}
</style>
